<template>
  <div class="content-wrapper">
    <div class="content-header">生产指令</div>
    <div class="content-container">
    <el-form :inline="true" :model="listQuery" class="filter-container">
      <el-form-item label="产品项目">
        <el-cascader
          ref="cascader"
          v-model="ProducValue"
          :options="ProductList"
          @change="change"
        ></el-cascader>
      </el-form-item>
      <el-form-item label="批号">
        <el-input v-model="listQuery.batchCode" placeholder="输入批号"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button
          class="filter-item"
          size="small"
          round
          type="primary"
          icon="el-icon-search"
          @click="getDataList"
        >
          搜索
        </el-button>
        <el-button
          class="filter-item"
          size="small"
          plain
          round
          icon="el-icon-plus"
          @click="showSend"
        >
          添加指令
        </el-button>
      </el-form-item>
    </el-form>
    <el-table
      height="500"
      v-loading="listLoading"
      :data="list"
      highlight-current-row
    >
      <el-table-column
        label="产品项目"
        prop="productDictValue"
        min-width="100px"
      />
      <el-table-column
        label="产品子项"
        prop="subProductDictValue"
        min-width="100px"
      >
      </el-table-column>
      <el-table-column
        label="生产工艺"
        prop="techDocumentName"
        min-width="100px"
      />
      <el-table-column
        label="批号"
        prop="batchCode"
        width="100px"
        align="center"
      />
      <el-table-column label="备注" prop="memo" min-width="100px" />
      <el-table-column label="下发次序" prop="sequence" width="100px" />
      <el-table-column label="下发时间" prop="sendTime" width="160px">
        <template slot-scope="{ row }">
          {{ row.sendTime || '暂无下发时间' }}
        </template>
      </el-table-column>
      <el-table-column label="生产员" prop="receiveUserName" width="100px" />
      <el-table-column label="状态" prop="status" width="100px">
        <template slot-scope="{ row }">
          <el-tag v-if="row.status == 1" type="success">下发</el-tag>
          <el-tag v-if="row.status==0" type="danger">未下发</el-tag>
<!--           <el-tag v-if="row.status==2" type="info">取消</el-tag>-->
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" width="80px" fixed="right">
        <template slot-scope="{ row }">
          <el-dropdown trigger="click" class="filter-item">
            <el-button v-if="!row.status == 1" type="text" class="el-icon-more" />
            <el-dropdown-menu slot="dropdown" class="user-dropdown">
              <el-dropdown-item
                @click.native="Modification(row)"
                v-if="row.status == 0"
                >修改</el-dropdown-item
              >
              <el-dropdown-item
                @click.native="Issue(row)"
                v-if="row.status == 0"
                >下发</el-dropdown-item
              >
<!--              <el-dropdown-item-->
<!--                @click.native="Issue(row)"-->
<!--                v-if="row.status == 1"-->
<!--                >取消下发</el-dropdown-item-->
<!--              >-->
              <el-dropdown-item
                @click.native="Cancel(row)"
                v-if="row.status == 0"
                >取消</el-dropdown-item
              >
              <el-dropdown-item @click.native="Delete(row)"
                v-if="row.status == 2"
                >删除</el-dropdown-item
              >
            </el-dropdown-menu>
          </el-dropdown>
        </template>
      </el-table-column>
    </el-table>

    <Create
      :dialogVisible="dialogVisibleCreate"
      :modificationData="modificationData"
      v-on:promptMessage="promptMessage"
    ></Create>
    <pagination
      v-show="total > 0"
      :total="total"
      :page-number.sync="listQuery.pageNumber"
      :page-size.sync="listQuery.pageSize"
      @pagination="getDataList"
    />
    </div>
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import Create from '@/views/manufacture/manufacture_list_apply/create.vue'
import {
  getPageData,
  updateStatus,
  updateDelete
} from '@/api/rs/manufacture.js'
import { listDictTreeItem } from '@/api/base/dict.js'
export default {
  components: {
    Pagination,
    Create
  },
  data() {
    return {
      listLoading: false,
      list: [{}],
      listQuery: {
        pageNumber: 1,
        pageIndex: 0,
        pageSize: 10,
        subProductDictCode: '',
        batchCode: ''
      },
      total: 0,
      dialogVisibleCreate: undefined,
      ProductList: [],
      ProducValue: '',
      IssueData: {
        status: '',
        manufactureApplyId: ''
      },
      modificationData: ''
    }
  },
  mounted() {
    this.getDataList()
    this.listDictTreeItem()
  },
  methods: {
    //分页
    getDataList() {
      this.listQuery.pageIndex = this.listQuery.pageNumber - 1
      getPageData(this.listQuery).then((res) => {
        this.list = res.data.rows
        this.total = res.data.total
      })
    },
    // 获取产品子项
    async listDictTreeItem() {
      let data = await listDictTreeItem({
        dictGroupCode: 'product',
        parentDictId: 0
      })
      this.ProductList = data.data
    },
    //获取选中项目
    change(val) {
      console.log(val, 'val')
      this.listQuery.subProductDictCode = val[1]
    },
    showSend() {
      this.dialogVisibleCreate = {
        dialogVisible: true,
        label: '添加',
        type: 1
      }
    },
    promptMessage(data) {
      if (data == 1) {
        this.getDataList()
      }
    },
    // 修改
    Modification(row) {
      let data = row
      console.log(data, 'data')
      this.dialogVisibleCreate = {
        dialogVisible: true,
        label: '修改',
        type: 2
      }
      this.modificationData = row
    },
    // 下发
    Issue(row) {
      if (row.status == 0) {
        this.IssueData.status = 1
      } else if (row.status == 1) {
        this.IssueData.status = 0
      }
      this.IssueData.manufactureApplyId = row.manufactureApplyId
      updateStatus(this.IssueData).then((res) => {
        if (res.code == 1) {
          this.getDataList()
          this.$message({
            message: '更新成功',
            type: 'success'
          })
        }
      })
    },
    // 取消
    Cancel(row) {
      this.IssueData.manufactureApplyId = row.manufactureApplyId
      this.IssueData.status = 2
      updateStatus(this.IssueData).then((res) => {
        if (res.code == 1) {
          this.getDataList()
          this.$message({
            message: '取消成功',
            type: 'success'
          })
        }
      })
    },
    // 删除
    Delete(row) {
      this.IssueData.manufactureApplyId = row.manufactureApplyId
      updateDelete({
        manufactureApplyId: this.IssueData.manufactureApplyId
      }).then((res) => {
        if (res.code == 1) {
          this.getDataList()
          this.$message({
            message: '删除成功',
            type: 'success'
          })
        }
      })
    }
  }
}
</script>
